<!doctype HTML public "-//W3C//DTD HTML 4.0 Frameset//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="generator" content="Adobe RoboHelp - www.adobe.com">
<title>Applying gradient colors</title>
<link rel="stylesheet" href="userhelp_ns.css"><script type="text/javascript" language="JavaScript" title="WebHelpSplitCss">
<!--
if (navigator.appName !="Netscape")
{   document.write("<link rel='stylesheet' href='userhelp.css'>");}
//-->
</script>
<style type="text/css">
<!--
ul.whs1 { list-style:disc; }
p.whs2 { margin-left:40px; }
img_whs3 { border:none; width:367px; height:128px; float:none; border-style:none; }
ol.whs4 { list-style:decimal; }
p.whs5 { color:#000000; font-weight:normal; }
-->
</style><script type="text/javascript" language="JavaScript" title="WebHelpInlineScript">
<!--
function reDo() {
  if (innerWidth != origWidth || innerHeight != origHeight)
     location.reload();
}
if ((parseInt(navigator.appVersion) == 4) && (navigator.appName == "Netscape")) {
	origWidth = innerWidth;
	origHeight = innerHeight;
	onresize = reDo;
}
onerror = null; 
//-->
</script>
<style type="text/css">
<!--
div.WebHelpPopupMenu { position:absolute; left:0px; top:0px; z-index:4; visibility:hidden; }
-->
</style><script type="text/javascript" language="javascript1.2" src="whmsg.js"></script>
<script type="text/javascript" language="javascript" src="whver.js"></script>
<script type="text/javascript" language="javascript1.2" src="whproxy.js"></script>
<script type="text/javascript" language="javascript1.2" src="whutils.js"></script>
<script type="text/javascript" language="javascript1.2" src="whlang.js"></script>
<script type="text/javascript" language="javascript1.2" src="whtopic.js"></script>
</head>
<body><script type="text/javascript" language="javascript1.2">
<!--
if (window.gbWhTopic)
{
	if (window.addTocInfo)
	{
	addTocInfo("Creating and modifying documents and dashboards\nCreating and formatting a document\nFormatting documents\nApplying gradient colors");
addButton("show",BTN_TEXT,"Show","","","","",0,0,"","","");

	}
	if (window.writeBtnStyle)
		writeBtnStyle();

	if (window.writeIntopicBar)
		writeIntopicBar(1);

	if(1)
	{
	
	}

	if (window.setRelStartPage)
	{
	setRelStartPage("MicroStrategy_Web_Help.htm");

		autoSync(1);
		sendSyncInfo();
		sendAveInfoOut();
	}
}
else
	if (window.gbIE4)
		document.location.reload();

//-->
</script>
<h1>Applying gradient colors</h1>
<p>Gradient colors blend two colors to create a gradual color change in 
 the background of a control. You can select the two colors, as well as 
 the direction of the blending. The direction is called the Gradient Variant, 
 and you can choose from the following directions:</p>
<ul type="disc" class="whs1">
	
<li class=p><p>Left to right</p></li>
	
<li class=p><p>Right to left</p></li>
	
<li class=p><p>Top to bottom</p></li>
	
<li class=p><p>Bottom to top</p></li>
</ul>
<p>Three-way or mirror gradients blend the colors from the middle of the 
 control out to the edges. That is, one color is applied in the center 
 of the control and the other to the edges of the control, then the two 
 are blended. The two halves of the control are identical, as though a 
 mirror was placed along the center of the control. You can choose to blend 
 the colors horizontally or vertically, as shown in the rectangles below, 
 by specifying the Gradient Variant:</p>
<p class="whs2"><img src="images/gradientsmirror.gif" x-maintain-ratio="TRUE" width="367px" height="128px" border="0" class="img_whs3"></p>
<p>Three-way gradients are rendered only in Flash Mode. They are rendered 
 as non-mirrored gradients in other Web display modes and in Desktop. A 
 horizontally &nbsp;centered gradient is rendered as a 
 Left to right variant and a vertically centered gradient as a Top to bottom 
 variant.</p>
<p>You can use gradient colors on the following types of controls:</p>
<ul type="disc" class="whs1">
	
<li class=p><p>
<a HREF="Using_GG_in_documents.htm">Grid/Graphs</a> 
 <span style="margin-left: 40px;">(You cannot apply a gradient to a graph 
 dataset report in a document.)</span></p></li>
</ul>
<ul type="disc" class="whs1">
	
<li class=p><p>
<a HREF="Panels_and_panel_stacks.htm">Panels</a> (Each 
 panel in a panel stack can have an individual color scheme) </p></li>
	
<li class=p><p>
<a HREF="Add_rectangles_to_documents.htm">Rectangles 
 and rounded rectangles </a></p></li>
	
<li class=p><p>
<a HREF="Sections_in_documents.htm">Sections</a> </p></li>
	
<li class=p><p>
<a HREF="Selectors.htm">Selectors</a> </p></li>
	
<li class=p><p>
<a HREF="Add_text_data_to_documents.htm">Text fields</a> 
 </p></li>
</ul>
<p>Gradients can also be applied to graph reports, as described in 
<a HREF="Gradient_colors_on_graph.htm">Applying 
 gradient colors to a graph</a>.</p>
<h2>To apply gradient colors to a control</h2>
<ol type="1" class="whs4">
	
<li class=p><p>Open the document in <span style="font-weight: bold;"><B>Design 
 </B></span>or <span style="font-weight: bold;"><B>Editable Mode</B></span>.</p></li>
	
<li class=p><p>Add one of the controls listed above.</p></li>
	
<li style=" color: #000000; font-weight: normal; " class=p><p class="whs5">Right-click 
 the control and select<span style="font-weight: bold;"><B> Properties and 
 Formatting</B></span>. The Properties and Formatting dialog box opens.</p></li>
	
<li style=" color: #000000; font-weight: normal; " class=p><p class="whs5">From 
 the left, select <span style="font-weight: bold;"><B>Color and Lines</B></span>.</p></li>
	
<li style=" color: #000000; font-weight: normal; " class=p><p class="whs5">In 
 the <span style="font-weight: bold;"><B>Fill</B></span> area, expand the <span 
 style="font-weight: bold;"><B>Color</B></span> drop-down list and <span>s</span><span>elect</span><span 
 style="font-weight: bold;"><B> Gradients</B></span><span>. The Gradients dialog 
 box is displayed. </span></p></li>
	
<li style=" color: #000000; font-weight: normal; " class=p><p class="whs5">Select 
 the two colors in which to create a gradient from the <span style="font-weight: bold;"><B>Color 
 1</B></span> and <span style="font-weight: bold;"><B>Color 2</B></span> drop-down 
 lists.</p></li>
	
<li style=" color: #000000; font-weight: normal; " class=p><p class="whs5">In 
 the <span style="font-weight: bold;"><B>Shading Styles</B></span> area, select 
 the direction of the shading and then select a variant.</p></li>
	<ul>
<li style="list-style: disc;  color: #000000; " type=disc class=p><p class="whs5">You can select a mirror-like 
 gradient to apply to objects displayed in Flash Mode. To do so, select 
 the Flash-only variant.</p></li>
	</ul>
	
<li style=" color: #000000; font-weight: normal; " class=p><p class="whs5">Click 
 <span style="font-weight: bold;"><B>OK</B></span> to apply the changes and return 
 to the document.</p></li>
</ol>
<h3>Related topic</h3>
<ul type="disc" class="whs1">
	
<li style=" color: #000000; " class=p><p class="whs5">
<a 
 href="Gradient_colors_on_graph.htm">Applying gradient colors to a graph</a></p></li>
</ul>
<script type="text/javascript" language="javascript1.2">
<!--
highlightSearch();
if (window.writeIntopicBar)
	writeIntopicBar(0);
if(0)
{

}
//-->
</script>
</body>
</html>
